import QtQuick 1.0
import com.meego 1.0
import QtMobility.location 1.1
import "CommomUtil.js" as Util
import "Citys.js" as CitysUtil

Page {
    id: citys_page

    tools: ModuleToolBar{}

    orientationLock : PageOrientation.LockPortrait

    property int fontSize: 16

    //init GPS etc
    PositionSource {
        id: positionSource
        //active: false
        active: false
    }

    TitleBar{
        id: citys_title
        anchors.top: citys_page.top; anchors.left: citys_page.left
        width: citys_page.width; height: 71
        titleName: "选择省份"
    }

    BorderImage {
        id: citys_body_back
        source: "../images/citys/back.png"
        width: citys_page.width; height: citys_page.height - citys_title.height
        anchors.top: citys_title.bottom; anchors.left: citys_page.left
    }

    Rectangle{
        id: citys_current
        width: citys_page.width; height: 111
        anchors.left: citys_page.left; anchors.top: citys_body_back.top
        opacity: 0
    }

    Text {
        id: citys_current_title
        color: "#7a7575"
        text: "当前城市(GPS)"
        font.bold: true; font.pointSize: citys_page.fontSize
        anchors.left: citys_current.left; anchors.top: citys_current.top
        anchors.leftMargin: 42; anchors.topMargin: 37
        width: 200
    }

    Text {
        id: citys_current_city
        color: "#7a7575"
        text: CitysUtil.getCurrentCityName();
        font.bold: true; font.pointSize: citys_page.fontSize + 2
        anchors.left: citys_current_title.right; anchors.top: citys_current.top
        anchors.leftMargin: 20; anchors.topMargin: 37
    }



    Rectangle{
        id: citys_selection_rect
        width: citys_current.width; height: 70
        anchors.left: citys_body_back.left; anchors.top: citys_current.bottom
        opacity: 0
    }

    Text{
        id: citys_selection_title
        color: "#7a7575"
        text: "请选择城市"
        font.bold: true; font.pointSize: citys_page.fontSize
        anchors.left: citys_selection_rect.left; anchors.leftMargin: 42
        anchors.top: citys_selection_rect.top; anchors.topMargin: 22
    }

    XmlListModel {
         id: citys_data
         source: CitysUtil.getCitys();
         query: "/Response/Citys/City"

         XmlRole { name: "Id"; query: "Id/string()" }
         XmlRole { name: "Name"; query: "Name/string()" }

    }

    Grid {
        id: citys_selection
        width: citys_page.width - 16
        height: citys_body_back.height - citys_current.height - citys_selection_rect.height
        anchors.top: citys_selection_rect.bottom;
        anchors.left: citys_page.left; anchors.leftMargin: 16

        columns: 5

        spacing: 1

        Repeater {
            model: citys_data

            delegate:CitysGridItem {
                width: citys_selection.width / citys_selection.columns; height: 49
                text: Name
                fontSize: citys_page.fontSize
                cityId: Id
            }
        }
    }

    Component.onCompleted: {
        positionSource.active = true;

        console.log("positionSource.positioningMethod:"+positionSource.positioningMethod);
        CitysUtil.current_lat = positionSource.position.coordinate.latitude;
        CitysUtil.current_long = positionSource.position.coordinate.longitude;
        getCityByGPS();
    }

   function getCityByGPS(){
        Util.getXmlStringByUrl(CitysUtil.getCityFromGPS(), gpsCallback);
    }

    function gpsCallback(responseXml){
        if(responseXml !== null){
            var a = responseXml.documentElement;
            citys_current_city.text = a.childNodes[0].childNodes[1].childNodes[2].childNodes[0].nodeValue
        }
    }
}
